<template>

	<div class="container">

		<!-- 搜索区域 -->
		<el-row>
			<el-form :inline="true" :model="queryData">
				<el-form-item label="咨询用户">
					<el-input v-model="queryData.username" @clear="queryLikeList" clearable
						placeholder="请输入用户名"></el-input>
				</el-form-item>
				<el-form-item label="咨询师">
					<el-input v-model="queryData.name" @clear="queryLikeList" clearable placeholder="请输入咨询师"></el-input>
				</el-form-item>
				<!-- <el-form-item label="创建时间">
						<el-date-picker v-model="timeStr" type="daterange" range-separator="至" start-placeholder="开始日期"
							end-placeholder="结束日期" value-format="yyyy-MM-dd">
						</el-date-picker>
					</el-form-item> -->

				<el-form-item>
					<el-button type="primary" @click="queryLikeList">搜索</el-button>

					<el-button type="danger" @click="removBatch">批量删除</el-button>
				</el-form-item>
			</el-form>
		</el-row>
		<!-- 数据表格区域 -->
		<el-table :data="dataList" border style="width: 100%" @selection-change="handleSelectionChange">
			<el-table-column type="selection" width="55"></el-table-column>
			<el-table-column prop="id" label="ID" width="180"></el-table-column>
			<el-table-column prop="type" label="类型"></el-table-column>
			<el-table-column prop="userList[0].username" label="咨询用户"></el-table-column>
			<el-table-column prop="content" label="情况说明" width="180"></el-table-column>
			<el-table-column prop="teacherList[0].name" label="咨询师"></el-table-column>
			<el-table-column prop="createTime" label="发布时间"></el-table-column>
			<el-table-column prop="status" label="状态"></el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button size="mini" type="danger" @click="remove(scope.row.id)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-dialog :title="title" :visible.sync="dialogFormVisible" @close="cancle">
			<el-form :model="addOrUpdateData" label-width="100px" ref="addOrUpdateForm">

				<el-form-item label="咨询用户">
					<el-input v-model="addOrUpdateData.uname"></el-input>
				</el-form-item>
				<el-form-item label="情况说明">
					<el-input v-model="addOrUpdateData.intro"></el-input>
				</el-form-item>
				<el-form-item label="咨询师">
					<el-input v-model="addOrUpdateData.cname"></el-input>
				</el-form-item>
				<el-form-item label="咨询时间">
					<el-input v-model="addOrUpdateData.reserveTime"></el-input>
				</el-form-item>

			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="cancle">取 消</el-button>
				<el-button type="primary" @click="confirm">确 定</el-button>
			</div>
		</el-dialog>
		<!-- 分页区域 -->
		<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
			:current-page="queryData.pageNum" :page-sizes="[5, 10, 15, 20]" :page-size="queryData.pageSize"
			layout="total, sizes, prev, pager, next, jumper" :total="total">
		</el-pagination>

	</div>
</template>

<script>
	export default {
		data() {
			return {
				// 查询参数对象
				queryData: {
					pageNum: 1,
					pageSize: 10,
					content: '',
					username: '',
					name: ''
				},
				queryClassifyData: {

				},
				allObj: {},
				total: 0,
				title: '查看问题', // 对话框的标题
				dataList: [], // 当前页数据列表
				dialogFormVisible: false,
				timeStr: '',
				context: '',
				// 新增和修改数据集
				addOrUpdateData: {
					id: "", //测评id
					reserveTime: "", //测评内容
					intro: '',
					userId: "",
					consultId: '',
					del: "0"
				},
				ids: [], //批量删除 id数组
				dialogVisible: false,
			}
		},
		// created(){
		//           this.axios.get("http://localhost:8080/shifangzhiyu_ssm/consultWait/all")
		//           .then((res)=>{
		//             // res存储的是通过连接取得的数据
		//             console.log(res.data.data)
		//             // this.dataList= res.data.data;
		// 			console.log("12321313")
		// 			console.log(res.data.data[0].status)
		// 			var arr = res.data.data

		// 			for(var i = 0; i < arr.length;i++){
		// 				if(arr[i].status == "0"){
		// 					arr[i].status == "未完成"
		// 				}
		// 				console.log(arr[i].status)
		// 			}
		// 			console.log(a)
		// 			 this.dataList= arr;

		//           }).catch((err)=>{
		//             console.log("请求失败")
		//           })
		//           console.log(this.addressAll)
		//         },
		methods: {
			show() {
				console.log(this.context)
			},
			handleSelectionChange(val) {
				// val是选中的数组对象, map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
				this.ids = val.map(item => item.id);
			},
			// 批量删除
			removBatch() {
				if (this.ids.length == 0) {
					this.$message('请选择要删除的数据!');
				} else {
					this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						this.axios.delete('http://localhost:8080/consultWait?ids=' + this.ids)
							.then(resp => {
								if (resp.data.code == 200) {
									this.$message({
										type: 'success',
										message: '删除成功!'
									})
									// 重新查询
									this.queryLikeList()
								} else {
									this.$message({
										type: 'error',
										message: '删除失败!'
									})
								}
							})
					}).catch(() => {
						this.$message({
							type: 'info',
							message: '已取消删除'
						});
					});
				}
			},
			// 每页条目数改变的回调
			handleSizeChange(val) {
				// 修改查询参数的pageSize
				this.queryData.pageSize = val;
				// pageSize改变，默认查询第一页
				this.queryData.pageNum = 1;
				// 重新查询
				this.queryLikeList()
			},
			// 页码发生改变的回调
			handleCurrentChange(val) {
				// 修改查询参数的pageNum
				this.queryData.pageNum = val;
				// 重新查询
				this.queryLikeList()
			},
			// 封装查询用户列表数据的函数
			queryLikeList() {
				this.axios.get('http://localhost:8080/consultWait', {
					params: {
						username: this.queryData.username,
						name: this.queryData.name,
						pageNum: this.queryData.pageNum,
						pageSize: this.queryData.pageSize

					}
				}).then(resp => {
					console.log(resp);
					


					console.log(resp.data)
					if (resp.data.code == 200) {
						var arr = resp.data.data.list
						console.log(resp.data.data)
						for (var i = 0; i < arr.length; i++) {
							if (arr[i].status == 0) {
								arr[i].status = "未完成"
							}
							if (arr[i].status == 1) {
								arr[i].status = "未评价"
							}
							if (arr[i].status == 2) {
								arr[i].status = "已评价"
							}
							if (arr[i].status == 3) {
								arr[i].status = "已完成"
							}
							console.log(arr[i].status)
						}

						this.dataList = arr;
						console.log(resp);
						this.dataList=resp.data.data.list
						this.total = resp.data.data.total
					} else {
						this.$message.error('用户数据加载失败')
					}
				})

			},
			queryList() {

				// 因为自定义axios已经定义了baseUrl，所以这里直接写相对路径即可
				// this.axios.get('cr/page', {
				// 	params: this.queryData
				// }).then(resp => {
				// 	if (resp.code == 200) {
				// 		console.log(resp.data.list);
				// 		this.dataList = resp.data.list
				// 		this.total = resp.data.total
				// 	} else {
				// 		this.$message.error('用户数据加载失败')
				// 	}
				// })

				this.axios.get("http://localhost:8080/consultWait")
					.then((res) => {
						// res存储的是通过连接取得的数据
						// console.log(res.data.data)
						this.dataList = res.data.data;
						this.total = resp.data.data.length
					}).catch((err) => {
						console.log("请求失败")
					})
				console.log(this.addressAll)
			},
			// 对话框的取消按钮事件函数: 清空对话的数据
			cancle() {
				this.dialogFormVisible = false
				this.addOrUpdateData = {
					id: "", //测评id
					reserveTime: "", //测评内容
					intro: '',
					userId: "",
					createTime: '',
					consultId: '',
					del: "0"
				}

			},
			// 对话框的确定按钮事件函数
			confirm() {
				this.dialogFormVisible = false

				if (this.addOrUpdateData.id == "") { // 执行新增请求
					this.$ajax.post('cr', this.addOrUpdateData).then(resp => {
						if (resp.code == 200) {
							this.$message.success(resp.message)
							// 重新查询
							this.queryList()
						} else {
							this.$message.error(resp.message)
						}
					})
				} else {
					this.$ajax.put('cr', this.addOrUpdateData).then(resp => {
						if (resp.code == 200) {
							this.$message.success(resp.message)
							// 重新查询
							this.queryList()
						} else {
							this.$message.error(resp.message)
						}
					})
				}
				this.cancle()
			},

			// 新增
			add() {
				this.dialogFormVisible = true;
				this.title = '新增测评'
			},
			// 修改
			edit(row) {
				this.title = '回复显示'
				this.dialogFormVisible = true;
				this.$ajax.get('cr/' + row.id).then(resp => {
					console.log(resp.data);
					this.addOrUpdateData = resp.data
				})
			},
			// 删除
			remove(id) {
				console.log(id)
				this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {

					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.axios.delete('http://localhost:8080/consultWait/' + id).then(res => {
						console.log(res.data)
						if (res.data.code == 200) {
							this.$message({
								type: 'success',
								message: '删除成功!'
							})
							// 重新查询
							this.queryLikeList()
						} else {
							this.$message({
								type: 'error',
								message: '删除失败!'
							})
						}

					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
		},
		// 页面初始化的时候，加载第一页的数据
		mounted() {
			this.queryLikeList()
		},

		watch: {

			timeStr(newValue, oldValue) {
				if (newValue == null) {
					this.queryData.startTime = '';
					this.queryData.endTime = '';
				} else {
					this.queryData.startTime = newValue[0];
					this.queryData.endTime = newValue[1];
				}
			}
		}
	}
</script>

<style scoped>
	.el-breadcrumb {
		margin-bottom: 15px;
		border-bottom: 1px solid #eee;
		padding-bottom: 15px;
	}

	.el-pagination {
		margin-top: 15px
	}


	.el-col>.el-select {
		width: 100%;
	}
</style>